<%@ page language="java" contentType="text/html; charset=UTF-8"
	pageEncoding="UTF-8"%>
<!--超级管理员主页-->
<!--显示所有医生信息-->
<!--在显示医生信息，删除或者修改医生信息-->
<!--可分条件查询医生信息，可模糊查询医生信息-->
<!--选择个人中心进行修改密码-->
<!DOCTYPE html>
<html lang="en">

<head>
<meta charset="utf-8">
<meta name="viewport" content="width=device-width, initial-scale=1.0">
<title>超级管理员主页</title>
<link rel="shortcut icon" href="img/favicon.ico">
<!--STYLESHEET-->
<!--=================================================-->
<!--Roboto Slab Font [ OPTIONAL ] -->
<link
	href="http://fonts.googleapis.com/css?family=Roboto+Slab:400,300,100,700"
	rel="stylesheet">
<link
	href="http://fonts.googleapis.com/css?family=Roboto:500,400italic,100,700italic,300,700,500italic,400"
	rel="stylesheet">
<!--Bootstrap Stylesheet [ REQUIRED ]-->
<link href="css/bootstrap.min.css" rel="stylesheet">
<!--Jasmine Stylesheet [ REQUIRED ]-->
<link href="css/style.css" rel="stylesheet">
<!--Font Awesome [ OPTIONAL ]-->
<link href="plugins/font-awesome/css/font-awesome.min.css"
	rel="stylesheet">
<!--Switchery [ OPTIONAL ]-->
<link href="plugins/switchery/switchery.min.css" rel="stylesheet">
<!--Bootstrap Select [ OPTIONAL ]-->
<link href="plugins/bootstrap-select/bootstrap-select.min.css"
	rel="stylesheet">
<!--Demo [ DEMONSTRATION ]-->
<link href="css/demo/jasmine.css" rel="stylesheet">
<!--SCRIPT-->
<!--=================================================-->
<!--Page Load Progress Bar [ OPTIONAL ]-->
<link href="plugins/pace/pace.min.css" rel="stylesheet">
<script src="plugins/pace/pace.min.js"></script>
</head>

<body>

	<div id="container"
		class="effect mainnav-sm navbar-fixed mainnav-fixed">
		<div class="boxed">

			<header id="navbar">
				<div id="navbar-container" class="boxed">
					<div class="navbar-content clearfix">
						<ul class="nav navbar-top-links pull-left">
							<li class="tgl-menu-btn"><a class="mainnav-toggle" href="#">
									<i class="fa fa-navicon fa-lg"></i>
							</a></li>
						</ul>
						<ul class="nav navbar-top-links pull-right">
							<!--~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~-->
							<li id="dropdown-user" class="dropdown"><a href="#"
								data-toggle="dropdown" class="dropdown-toggle text-right"> <span
									class="pull-right"> <img
										class="img-circle img-user media-object" src="img/super.png"
										alt="Profile Picture">
								</span>
									<div class="username hidden-xs">super</div>
							</a></li>
						</ul>
					</div>
				</div>
			</header>
			<div id="content-container">
				<div class="pageheader hidden-xs">
					<h3>
						<i class="fa fa-home"></i>医疗系统超级管理员界面
					</h3>
				</div>
				<div id="page-content">
					<div class="row">
						<div class="col-lg-12">
							<div class="panel">
								<div class="panel-heading">
									<h3 class="panel-title">医生目录</h3>
								</div>
								<div class="panel-body">
									<div class="row">
										<div class="col-sm-9" style="width: 60%">
											<div class="form-group">
												<input id="demo-foo-search" type="text" placeholder="你需要找谁?"
													class="form-control search-input" autocomplete="off">
											</div>
										</div>
										<div class="col-sm-3" style="width: 20%; padding-left: 5%">
											<div class="form-group">
												<select id="demo-status" class="form-control search-input">
													<option value="hospital">医院</option>
													<option value="department">科室</option>
													<option value="doctor">医生</option>
												</select>
											</div>
										</div>
										<div class="col-sm-3" style="width: 8%; margin-left: 10%;">
											<div class="form-group" style="margin: 4px auto;">
												<button id="manage" style="width: 70px; height: 45px">删除</button>
											</div>
										</div>
									</div>
								</div>
								<!-- Foo Table - Filtering -->
								<!--===================================================-->
								<table id="demo-foo-filtering"
									class="table table-bordered table-hover toggle-circle"
									data-page-size="7">
									<thead>
										<tr>
											<th><input type="checkbox" name="" value=""></th>
											<th>医生id</th>
											<th data-toggle="true">医生姓名</th>
											<th>电话号码</th>
											<th>科室</th>
											<th data-hide="phone, tablet">医院</th>
										</tr>
									</thead>
									<tbody id="doctor">
									</tbody>
									<tfoot>
										<tr>
											<td colspan="6">
												<div class="text-right">
													<ul class="pagination"></ul>
												</div>
											</td>
										</tr>
									</tfoot>
								</table>
								<!--===================================================-->
								<!-- End Foo Table - Filtering -->
							</div>
						</div>
					</div>
				</div>
				<!--===================================================-->
				<!--End page content-->
			</div>
			<nav id="mainnav-container">
				<!--Brand logo & name-->
				<!--================================-->
				<div class="navbar-header">
					<a href="index.html" class="navbar-brand"> <i
						class="fa fa-forumbee brand-icon"></i>
					</a>
				</div>
				<div id="mainnav">
					<div id="mainnav-menu-wrap">
						<div class="nano">
							<div class="nano-content">
								<ul id="mainnav-menu" class="list-group">
									<!--Category name-->
									<!--Menu list item-->
									<li><a href="superadminhomepage.jsp"> <i
											class="fa fa-home"></i>
									</a></li>

									<li><a href="#" data-original-title="" title="" class=""
										data-toggle="modal" data-target="#myModal"> <i
											class="fa fa-plus-square"></i>
									</a></li>

								</ul>
							</div>
						</div>
					</div>
				</div>
			</nav>
		</div>
		<footer id="footer">
			<div class="hide-fixed pull-right pad-rgt">Currently v1.0</div>
			<p class="pad-lft">jja2007 @2020医疗系统</p>
		</footer>
		<!--===================================================-->
		<!-- END FOOTER -->
		<!-- SCROLL TOP BUTTON -->
		<!--===================================================-->
		<button id="scroll-top" class="btn">
			<i class="fa fa-chevron-up"></i>
		</button>
		<!--===================================================-->
	</div>
	<!-- 模态框 -->
	<div class="modal fade" id="myModal">
		<div class="modal-dialog">
			<div class="modal-content">

				<!-- 模态框头部 -->
				<div class="modal-header">
					<h4 class="modal-title">选择添加内容</h4>
					<button type="button" class="close" data-dismiss="modal">&times;</button>
				</div>

				<!-- 模态框主体 -->
				<div class="modal-body">
					<a href="superinserthospital.jsp"><img alt=""
						src="img/hospital.png"
						style="width: 45%; height: 10%; margin-left: 3%;"></a> <a
						href="superinsertdoctor.jsp"><img alt="" src="img/doctor.png"
						style="width: 45%; height: 10%; margin: 5% auto;"></a>
				</div>

				<!-- 模态框底部 -->
				<div class="modal-footer">
					<button type="button" class="btn btn-secondary"
						data-dismiss="modal">关闭</button>
				</div>

			</div>
		</div>
	</div>
	<script
		src="${pageContext.request.contextPath}/back/js/jquery-3.2.1.js"></script>
	<!--BootstrapJS [ RECOMMENDED ]-->
	<script src="js/bootstrap.min.js"></script>
	<!--Fast Click [ OPTIONAL ]-->
	<script src="plugins/fast-click/fastclick.min.js"></script>
	<!--Jquery Nano Scroller js [ REQUIRED ]-->
	<script src="plugins/nanoscrollerjs/jquery.nanoscroller.min.js"></script>
	<!--Metismenu js [ REQUIRED ]-->
	<script src="plugins/metismenu/metismenu.min.js"></script>
	<!--Jasmine Admin [ RECOMMENDED ]-->
	<!-- <script src="js/scripts.js"></script> -->
	<!--Switchery [ OPTIONAL ]-->
	<script src="plugins/switchery/switchery.min.js"></script>
	<!--Bootstrap Select [ OPTIONAL ]-->
	<script src="plugins/bootstrap-select/bootstrap-select.min.js"></script>
	<!--FooTable [ OPTIONAL ]-->
	<script src="plugins/fooTable/dist/footable.all.min.js"></script>
	<!--Fullscreen jQuery [ OPTIONAL ]-->
	<script src="plugins/screenfull/screenfull.js"></script>
	<!--FooTable Example [ SAMPLE ]-->
	<!-- <script src="js/demo/pages-directory.js"></script> -->

	<script type="text/javascript">
		$(document).ready(function() {
			//进入主页显示医生列表
			sendAjax();

		});
		//进入主页显示医生列表
		function sendAjax() {
			$.ajax({
				async : true,
				url : "../SuperAdminServlet",
				type : "get",
				data : {},
				dataType : "json",
				success : function(result) {
					//调用渲染数据的方法
					showDoctor(result);
				},
				error : function() {
					alert("异步请求失败！")
				}
			});
		}
		//输入框失去焦点事件
		$("#demo-foo-search").blur(function() {
			//获取下拉框
			var genre = $("#demo-status").val();
			//获取输入框
			var genres = $(this).val();
			$.ajax({
				async : true,
				url : "../SuperAdminServlet",
				type : "post",
				data : {
					genre : genre,
					genres : genres
				},

				dataType : "json",
				success : function(result) {
					//调用渲染数据的方法
					showDoctor(result);
				},
				error : function() {
					alert("异步请求失败！")
				}

			});
		});

		//渲染数据到指DOM元素
		function showDoctor(result) {
			var content = "";
			for (var i = 0; i < result.length; i++) {

				content += "<tr>"
						+ "<td><input type=\"checkbox\" class=\"doctor-1\" name=\"doctor\" value=\"" + result[i].doctorId + "\"></td>"
						+ "<td>" + result[i].doctorId + "</td>" + "<td>"
						+ result[i].doctorName + "</td>" + "<td>"
						+ result[i].doctorTel + "</td>" + "<td>"
						+ result[i].department.departmentName + "</td>"
						+ "<td>" + result[i].department.hospital.hospitalName
						+ "</td>" + "</tr>"
			}
			$("#doctor").html(content);
		};
		//复选框
		$(function() {
			//表单选择器
			$(":checkbox:eq(0)").click(
					function() {
						//属性选择器 将全选复选框的checked属性值赋值给指定的复选框组
						$(":checkbox[name=doctor]").prop("checked",
								$(this).prop("checked"));
					});

			$(document).on("click", ":checkbox[name=doctor]", function() {
				//获取复选框组的个数
				var count = $(":checkbox[name=doctor]").length;
				//获取复选框组被选中的个数
				var checkCount = $(":checkbox[name=doctor]:checked").length;
				$(":checkbox:eq(0)").prop("checked", count == checkCount);

			});

		});
		//删除点击事件
		$("#manage").click(function() {
			//获取id
			var doctorId = $(":checkbox[name=doctor]:checked")
			var s = '';
			for (var i = 0; i < doctorId.length; i++) {

				s += doctorId[i].value + ','; //如果选中，将value添加到变量s中 

			}
			;
			//删除请求
			$.ajax({
				async : true,
				url : "../SuperAdminServlet",
				type : "post",
				data : {
					op : "deleteDoctor",
					doctor : s
				},
				dataType : "json",
				success : function(result) {
					if (result != "error") {
						alert("删除成功！");
						sendAjax();
					} else {
						alert("删除失败!");
					}
				},
				error : function() {
					alert("异步请求失败！")
				},

			});

		});
	</script>
</body>

</html>
